<template>
  <!-- 切换element-plus语言包 -->
  <el-config-provider :locale="data.lang[data.locale]">

    <router-view v-slot="{ Component }">
      <keep-alive v-if="route.meta && route.meta.keepAlive != false">
        <component :is="Component" />
      </keep-alive>
      <component v-else :is="Component" />
    </router-view>

  </el-config-provider>
</template>

<script setup>
import { reactive } from 'vue';
import { useRoute } from 'vue-router'
import { ElConfigProvider } from 'element-plus'
// import store from './store';
import EventBus from 'utils/EventBus.js'
import elementlangEn from "element-plus/lib/locale/lang/en";// element-plus语言包
import zhCn from 'element-plus/lib/locale/lang/zh-cn'// element-plus语言包
import i18n from 'locales';

const route = useRoute()
const data = reactive({
  lang: {
    'zh-CN': zhCn,
    'en-US': elementlangEn,
  },
  locale: "zh-CN",
})


// 默认语言
let historylang = localStorage.getItem("historylang");
data.locale = historylang ? historylang : "zh-CN";

EventBus.on('setLocale', data => {
  console.log(data)
  setI18n(data)
})

function setI18n(e) {
  localStorage.setItem("historylang", e)
  i18n.global.locale = e
  data.locale = e
}

</script>

<style lang="less">

* {
  padding: 0;
  box-sizing: border-box;
  margin: 0;
  text-decoration: none;
  list-style: none;
  border: none;
  font-family: Microsoft YaHei;
  font-size: 14px;
}
img {
  object-fit: cover;
}

.cursor {
  cursor: pointer;
}

html,
body,
#app {
  width: 100%;
}
</style>
